<template>
	<view class="content">
		<view class="app-title ac">
			<view class="fl" @click="back"><image class="back" src="/static/img/back.png"></image></view>设备下道
		</view>
		
		<view class="top-bg"></view>
		
		<view class="detail">
			<u-cell-group>
				<u-cell-item title="下道去向:" :value="data_list.xdgoto == '' ? '请选择' : data_list.xdgoto" @click="show_picker=true;columns=go_options"></u-cell-item>
				<u-cell-item title="下道机构" :value="go_name == '' ? '请选择' : go_name" @click="show_picker=true;columns=org_options"></u-cell-item>
				<u-cell-item title="下 道 人:" :value="username" :arrow="false"></u-cell-item>
			</u-cell-group>
			<view style="margin-top: 20px;"><b>器材列表</b></view>
			
			<view style="padding-right: 16px;margin-top: 16px;">
				<view class="table-title"><b>下道设备列表</b>
					<!-- <u-checkbox-group>
						<u-checkbox v-model="checked">复选框</u-checkbox>
					</u-checkbox-group>
					<view class="fr"><button class="remove ac">删除</button></view> -->
				</view>
				<view class="table-head">
					<view class="fl"></view><view class="fl"><b>设备名称</b></view><view class="fl"><b>设备类型</b></view><view class="fl"><b>设备型号</b></view>
					<view class="clearfix"></view>
				</view>
				<view class="table-body" v-for="(item,index) in data_list.eqtList" :key="index" @click="remove=index;show_confirm=true;">
					<view class="fl"><!-- <u-checkbox v-model="checked"></u-checkbox> --></view><view class="fl">{{item.eqtModelNum || '--'}}</view><view class="fl">{{item.eqtTypeName || '--'}}</view><view class="fl">{{item.eqtModelNum || '--'}}</view>
					<view class="clearfix"></view>
				</view>
			</view>
			
			<view class="btn">
				<button class="cancel-btn" @click="codeCheck">扫描</button><button class="default-btn fr" @click="pushData">下道</button>
			</view>
		</view>
		
		<view class="full" v-show="show_picker || show_confirm"></view>
		<u-select v-model="show_picker" :list="columns" label-name="text" @confirm="onConfirm" @cancel="onCancel"></u-select>
		<u-modal v-model="show_confirm" :show-title="false" :show-cancel-button="true" :content="content" @confirm="removeDevice" @cancel="onCancel"></u-modal>
	</view>
</template>

<script>
export default{
	data() {
		return {
			content : '确认是否要删除',
			username : uni.getStorageSync('username') || '',
			go_options:'',
			org_options:'',
			columns: [],
			data_list : {
				eqtList:[],
				    "notes": [   //上道位置备注
				      "string"
				    ],
				    "option": "saveEqtXd",  //操作   saveEqtSd 上道，  saveEqtXd 下道saveEqtReplace 更换
				    "sdDbm": "", //上道车站
				    "sdEqtZCid": [  //上道器材id
				      "1"
				    ],
				    "sdEqtid": [  //上道设备id
				      "1"
				    ],
				    "uid": this.getUserId(), //用户id
				    "workId": "1", //工作id
				    "xdDbm": "string", //下道车站
				    "xdEqtZCids": [ //下道器材id
				      "1"
				    ],
				    "xdEqtids": [  //下道设备id
				      "1"
				    ],
				    "xdgoto": ""  
			},
			checked : '',
			remove:'',
			go_name:'',
			show_picker : false,
			show_confirm : false
		}
	},
	created() {
		this.initOptions();
	},
	methods: {
		back() {
			uni.navigateBack();
		},
		onConfirm(value, index) {
			if(value[0].extra == 'go') {
				this.data_list.xdgoto = value[0].label;
			}else if(value[0].extra == 'org'){
				this.go_name = value[0].label;
			}
			this.onCancel();
		},
		onCancel() {
			this.show_picker = false;
			this.show_confirm = false;
		},
		removeDevice() {
			this.data_list.eqtList.splice(this.remove,1);
			this.remove="";
			this.onCancel();
		},
		initOptions() {
			this.fetch('GET',this.baseUrl()+'/eqtTZcController/queryEqtDic',{dicClass:'CHUKU_QUXIANG'}).then((res)=>{
				if(res.returnCode == 1) {
					this.go_options = res.data;
					this.go_options.map((item)=>{
						item.children = '';
						item.extra = 'go';
						item.text = item.dicname;
					})
				}
			})
			this.fetch('GET',this.baseUrl()+'/home/getOrgTreeByPerson',{personId:this.getUserId()}).then((res)=>{
				if(res.returnCode == 1) {
					this.org_options = res.data;
					this.org_options.map((item)=>{
						item.children = '';
						item.extra = 'org';
					})
				}
			})
		},
		codeCheck() {
			 // 允许从相机和相册扫码
			uni.scanCode({
			    success: (res) => {
			        if(res) {
						this.fetch('GET',this.baseUrl()+'/eqtTZcController/scanCode',{action:'3',code:res.result}).then((res)=>{
							if(res.returnCode == 1) this.data_list.eqtList = this.data_list.eqtList.concat(res.data);
						})
					}
				}
			});
		},
		pushData() {
			if(this.data_list.xdgoto == '') return uni.showToast({title:'请选择下道去向',icon:'none'});
			if(this.data_list.eqtList.length == 0) return uni.showToast({title:'请选择器材',icon:'none'});
			this.fetch('POST',this.baseUrl()+'/eqtTZcController/saveSdXd',this.data_list,true).then((res)=>{
				if(res.returnCode == 1) {
					uni.showToast({title:res.message,icon:'none'});
				}else{
					uni.showToast({title:res.message,icon:'none'});
				}
			})
		}
	}
}
</script>

<style scoped>
	.detail{
		margin-top: -180px;
	}
	.detail>.btn{
		position: absolute;bottom: 3%;left: 0;width: 100%;padding: 0 20px;
	}
	.detail>.btn>button{
		width: 48%;display: inline-block;
	}
	.table-title{
		margin: 0 auto;border:1px solid #F1F1F1;line-height: 53px;padding: 0 13px 0 10px;
	}
	.remove{
		border: 1px solid #DE542C;box-sizing: border-box;border-radius: 6px;width: 48px;height: 26px;font-size: 14px;color: #DE542C;line-height: 26px;margin-top: 14px;
	}
	.table-head,.table-body{
		line-height: 53px;border:1px solid #F1F1F1;border-top: 0;height: 53px;font-size: 14px;overflow: hidden;
	}
	.table-head>view:nth-child(1),.table-body>view:nth-child(1){
		width: 15%;border-right:1px solid #F1F1F1;padding-left: 15px;
	}
	.table-head>view:nth-child(2),.table-head>view:nth-child(3),.table-head>view:nth-child(4),.table-body>view:nth-child(2),.table-body>view:nth-child(3),.table-body>view:nth-child(4){
		width: 28.2%;border-right:1px solid #F1F1F1;padding-left: 5px;
	}
	.table-head>view:nth-child(4),.table-body>view:nth-child(4){
		border-right: 0;
	}
	
	/* .van-checkbox{
		height: 53px;display: inline-flex;line-height: 53px;
	} */
</style>
